{
 "metadata": {
  "kernelspec": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 2
   },
   "display_name": "IPython (Python 2)",
   "language": "python",
   "name": "python2"
  },
  "name": "",
  "signature": "sha256:7dfb60bad8050837b444209197ecee458e8c7be4edff10817ecdbaf61a7040c2"
 },
 "nbformat": 3,
 "nbformat_minor": 0,
 "worksheets": [
  {
   "cells": [
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "#Table of Contents\n",
      "* [1. Maps](#1.-Maps)\n",
      "\t* [1.1 Google Geochart](#1.1-Google-Geochart)\n",
      "\t* [1.2 Google Map Directions](#1.2-Google-Map-Directions)\n",
      "\t* [1.3 Google Colored Maps](#1.3-Google-Colored-Maps)\n",
      "* [2. Timelines](#2.-Timelines)\n",
      "\t* [2.1 Google Timelines](#2.1-Google-Timelines)\n",
      "\t* [2.2 Timeline JS](#2.2-Timeline-JS)\n",
      "* [3. Story Maps](#3.-Story-Maps)\n",
      "* [4. Presentations](#4.-Presentations)\n",
      "\t* [4.1 Google Slideshows](#4.1-Google-Slideshows)\n",
      "\t* [4.2 Prezis](#4.2-Prezis)\n",
      "* [5. Charts and Graphs](#5.-Charts-and-Graphs)\n",
      "\t* [5.1 Histogram](#5.1-Histogram)\n",
      "\t* [5.2 Area Chart](#5.2-Area-Chart)\n",
      "\t* [5.3 Scatter Plot](#5.3-Scatter-Plot)\n",
      "\t* [5.4 Pie Chart](#5.4-Pie-Chart)\n",
      "\t* [5.5 Line Chart](#5.5-Line-Chart)\n",
      "\t* [5.6 Column Chart](#5.6-Column-Chart)\n",
      "\t* [5.7 Bar Chart](#5.7-Bar-Chart)\n",
      "\t* [5.8 Motion Chart](#5.8-Motion-Chart)\n",
      "* [6. Data](#6.-Data)\n",
      "\t* [6.1 Google Spreadsheets](#6.1-Google-Spreadsheets)\n",
      "* [7. Videos](#7.-Videos)\n",
      "* [8. Other Embeddable Visuals](#8.-Other-Embeddable-Visuals)\n",
      "\t* [8.1 National Weather Service](#8.1-National-Weather-Service)\n",
      "\t* [8.2 Wikipedia Articles](#8.2-Wikipedia-Articles)\n",
      "* [9. Document Collaboration](#9.-Document-Collaboration)\n",
      "\t* [9.1 Commenting By Disqus](#9.1-Commenting-By-Disqus)\n",
      "* [10. Bibliographic Support](#10.-Bibliographic-Support)\n",
      "\t* [10.1 Internal BibTex Database](#10.1-Internal-BibTex-Database)\n",
      "\t* [10.2 Example Text With In-Line Citations](#10.2-Example-Text-With-In-Line-Citations)\n",
      "\t* [10.3 Example References List](#10.3-Example-References-List)\n"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "from calico.widgets import GoogleChart\n",
      "from IPython.display import display, HTML"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 13
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "1. Maps"
     ]
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "1.1 Google Geochart"
     ]
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "For more information on how to make Geoharts, you can learn more about Google Charts at the [Calico Project Wiki](calicoproject.org/ICalico)"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "GoogleChart(\"GeoChart\", ['Country', 'Variable Measured'], \n",
      "            [['United States', 20], \n",
      "             ['United Kingdom', 20],\n",
      "             ['France', 20], \n",
      "             ['China', 20], \n",
      "             ['Poland', 10], \n",
      "             ['Canada', 10], \n",
      "             ['Australia', 10],\n",
      "             ['New Zealand', 10], \n",
      "             ['Yugoslavia', 10], \n",
      "             ['Greece', 10], \n",
      "             ['Netherlands', 10], \n",
      "             ['Belgium', 10], \n",
      "             ['South Africa', 10], \n",
      "             ['Norway', 10], \n",
      "             ['Czech Republic', 10], \n",
      "             ['Slovakia', 10], \n",
      "             ['Ethiopia', 10], \n",
      "             ['Brazil', 10], \n",
      "             ['Denmark', 10], \n",
      "             ['Luxembourg', 10], \n",
      "             ['Cuba', 10], \n",
      "             ['Mexico', 10], \n",
      "             ['Russia', 20],\n",
      "             ['Ukraine', 20], \n",
      "             ['Uzbekistan', 20], \n",
      "             ['Kazakhstan', 20], \n",
      "             ['Belarus', 20], \n",
      "             ['Georgia', 20], \n",
      "             ['Azerbaijan', 20], \n",
      "             ['Moldova', 20], \n",
      "             ['Kirghizstan', 20], \n",
      "             ['Armenia', 20], \n",
      "             ['Latvia', 20], \n",
      "             ['Estonia', 20], \n",
      "             ['Lithuania', 20], \n",
      "             ['Turkmenistan', 20], \n",
      "             ['Tajikistan', 20], \n",
      "             ['Germany', 100], \n",
      "             ['Japan', 100], \n",
      "             ['Italy', 100], \n",
      "             ['Hungary', 100], \n",
      "             ['Romania', 100], \n",
      "             ['Bulgaria', 100]])"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [
      {
       "html": [
        "\n",
        "<div id=\"chart_div_4\" style=\"height: 400px;\"></div>\n",
        "\n",
        "<script type=\"text/javascript\">\n",
        "        require(['https://www.google.com/jsapi'], function () {\n",
        "          function drawChart() {                \n",
        "            var chart = new google.visualization.GeoChart(document.getElementById('chart_div_4'));\n",
        "\n",
        "            var data = google.visualization.arrayToDataTable([['Country', 'Variable Measured'], ['United States', 20], ['United Kingdom', 20], ['France', 20], ['China', 20], ['Poland', 10], ['Canada', 10], ['Australia', 10], ['New Zealand', 10], ['Yugoslavia', 10], ['Greece', 10], ['Netherlands', 10], ['Belgium', 10], ['South Africa', 10], ['Norway', 10], ['Czech Republic', 10], ['Slovakia', 10], ['Ethiopia', 10], ['Brazil', 10], ['Denmark', 10], ['Luxembourg', 10], ['Cuba', 10], ['Mexico', 10], ['Russia', 20], ['Ukraine', 20], ['Uzbekistan', 20], ['Kazakhstan', 20], ['Belarus', 20], ['Georgia', 20], ['Azerbaijan', 20], ['Moldova', 20], ['Kirghizstan', 20], ['Armenia', 20], ['Latvia', 20], ['Estonia', 20], ['Lithuania', 20], ['Turkmenistan', 20], ['Tajikistan', 20], ['Germany', 100], ['Japan', 100], ['Italy', 100], ['Hungary', 100], ['Romania', 100], ['Bulgaria', 100]]);\n",
        "            var options = {};\n",
        "            chart.draw(data, options);\n",
        "        };\n",
        "        google.load('visualization', '1.0', {'callback': drawChart, 'packages':['corechart']});\n",
        "        });\n",
        "</script>"
       ],
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 12,
       "text": [
        "<calico.widgets.googlechart.GoogleChart at 0x7f1e000bf1d0>"
       ]
      }
     ],
     "prompt_number": 12
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "1.2 Google Map Directions"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "<iframe src=\"https://mapsengine.google.com/map/embed?mid=ztCfVnTLYJpI.k361ruJPA6Dg\" width=\"800\" height=\"400\">\n",
      "</iframe>\n"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "<iframe src=\"https://mapsengine.google.com/map/embed?mid=ztCfVnTLYJpI.k361ruJPA6Dg\" width=\"800\" height=\"400\">\n",
        "</iframe>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 14
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "1.3 Google Colored Maps"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "<iframe src=\"https://chart.googleapis.com/chart?cht=map&chs=300x300&chld=FR-D|FR-B|FR&chco=676767|FF4444|44FF44|4444FF\" width=\"320px\" height=\"320px\" frameborder=\"0\"/>\n",
      "<iframe src=\"https://chart.googleapis.com/chart?cht=map:fixed=-60,0,80,-35&chs=600x350&chld=CA-BC|CN|IT|GR|US-UT&chdl=Vancouver|Beijing|Torino|Athens|Salt+Lake+City&chco=B3BCC0|5781AE|FF0000|FFC726|885E80|518274&chtt=Last+Five+Olympic+Hosts&chm=f2010+Winter,000000,0,0,10|f2008+Summer,000000,0,1,10|f2008+Winter,000000,0,2,10,1,:-5:10|f2004+Summer,000000,0,3,10|f2004+Summer,000000,0,4,10&chma=0,110,0,0\" width=\"610\" height=\"370\" frameborder=\"0\"/>\n",
      "<!--https://developers.google.com/chart/image/docs/gallery/new_map_charts-->"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "<iframe src=\"https://chart.googleapis.com/chart?cht=map&chs=300x300&chld=FR-D|FR-B|FR&chco=676767|FF4444|44FF44|4444FF\" width=\"320px\" height=\"320px\" frameborder=\"0\"/>\n",
        "<iframe src=\"https://chart.googleapis.com/chart?cht=map:fixed=-60,0,80,-35&chs=600x350&chld=CA-BC|CN|IT|GR|US-UT&chdl=Vancouver|Beijing|Torino|Athens|Salt+Lake+City&chco=B3BCC0|5781AE|FF0000|FFC726|885E80|518274&chtt=Last+Five+Olympic+Hosts&chm=f2010+Winter,000000,0,0,10|f2008+Summer,000000,0,1,10|f2008+Winter,000000,0,2,10,1,:-5:10|f2004+Summer,000000,0,3,10|f2004+Summer,000000,0,4,10&chma=0,110,0,0\" width=\"610\" height=\"370\" frameborder=\"0\"/>\n",
        "<!--https://developers.google.com/chart/image/docs/gallery/new_map_charts-->"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 15
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "2. Timelines"
     ]
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "2.1 Google Timelines"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "\n",
      "<script>\n",
      "require([\"https://www.google.com/jsapi\"], function (){\n",
      "function drawChart() {\n",
      "    var container = document.getElementById('example1');\n",
      "    \n",
      "    var chart = new google.visualization.Timeline(container);\n",
      "\n",
      "    var dataTable = new google.visualization.DataTable();\n",
      "\n",
      "    dataTable.addColumn({ type: 'string', id: 'President' });\n",
      "    dataTable.addColumn({ type: 'date', id: 'Start' });\n",
      "    dataTable.addColumn({ type: 'date', id: 'End' });\n",
      "\n",
      "    dataTable.addRows([[ 'Era 1', new Date(1789, 3, 29), new Date(1812, 2, 3) ],\n",
      "                       [ 'Era 2', new Date(1797, 2, 3),  new Date(1805, 2, 3) ], \n",
      "                       [ 'Era 3',  new Date(1801, 2, 3),  new Date(1809, 2, 3) ]]);\n",
      "\n",
      "    chart.draw(dataTable);\n",
      "}\n",
      "google.load('visualization', '1.0', {'callback':drawChart, packages:['timeline']});\n",
      "});\n",
      "</script>\n",
      "<div id=\"example1\" style=\"width: 100%; height: 180px;\"></div>"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<script>\n",
        "require([\"https://www.google.com/jsapi\"], function (){\n",
        "function drawChart() {\n",
        "    var container = document.getElementById('example1');\n",
        "    \n",
        "    var chart = new google.visualization.Timeline(container);\n",
        "\n",
        "    var dataTable = new google.visualization.DataTable();\n",
        "\n",
        "    dataTable.addColumn({ type: 'string', id: 'President' });\n",
        "    dataTable.addColumn({ type: 'date', id: 'Start' });\n",
        "    dataTable.addColumn({ type: 'date', id: 'End' });\n",
        "\n",
        "    dataTable.addRows([[ 'Era 1', new Date(1789, 3, 29), new Date(1812, 2, 3) ],\n",
        "                       [ 'Era 2', new Date(1797, 2, 3),  new Date(1805, 2, 3) ], \n",
        "                       [ 'Era 3',  new Date(1801, 2, 3),  new Date(1809, 2, 3) ]]);\n",
        "\n",
        "    chart.draw(dataTable);\n",
        "}\n",
        "google.load('visualization', '1.0', {'callback':drawChart, packages:['timeline']});\n",
        "});\n",
        "</script>\n",
        "<div id=\"example1\" style=\"width: 100%; height: 180px;\"></div>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 16
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "2.2 Timeline JS"
     ]
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "3. Story Maps"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "\n",
      "<iframe src=\"http://cdn.knightlab.com/libs/storymapjs/latest/embed/?url=https://www.googledrive.com/host/0B1d8oNIpMx53Wk9CdDlVZ01qU1E/published.json\" width=\"100%\" height=\"600\" frameborder=\"0\"/>\n",
      "Click <a href=\"http://storymap.knightlab.com/\" target=\"_blank\">here</a> for more information."
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<iframe src=\"http://cdn.knightlab.com/libs/storymapjs/latest/embed/?url=https://www.googledrive.com/host/0B1d8oNIpMx53Wk9CdDlVZ01qU1E/published.json\" width=\"100%\" height=\"600\" frameborder=\"0\"/>\n",
        "Click <a href=\"http://storymap.knightlab.com/\" target=\"_blank\">here</a> for more information."
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 25
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "4. Presentations"
     ]
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "4.1 Google Slideshows"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "\n",
      "<iframe src=\"https://docs.google.com/presentation/d/196SZalwroDU8tzXifxpxv7sV-V9ywX9n_nbBC0O4uDI/embed?start=false&loop=false&delayms=3000\" frameborder=\"0\" width=\"100%\" height=\"400px\" allowfullscreen=\"true\" mozallowfullscreen=\"true\" webkitallowfullscreen=\"true\"></iframe>"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<iframe src=\"https://docs.google.com/presentation/d/196SZalwroDU8tzXifxpxv7sV-V9ywX9n_nbBC0O4uDI/embed?start=false&loop=false&delayms=3000\" frameborder=\"0\" width=\"100%\" height=\"400px\" allowfullscreen=\"true\" mozallowfullscreen=\"true\" webkitallowfullscreen=\"true\"></iframe>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 26
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "4.2 Prezis"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "<iframe src=\"http://prezi.com/embed/5ye8po_hmikp/?bgcolor=ffffff&amp;lock_to_path=0&amp;autoplay=0&amp;autohide_ctrls=0&amp;features=undefined&amp;disabled_features=undefined&amp;html5=1\" width=\"550\" height=\"400\" frameBorder=\"0\" webkitAllowFullScreen mozAllowFullscreen allowfullscreen></iframe>"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "<iframe src=\"http://prezi.com/embed/5ye8po_hmikp/?bgcolor=ffffff&amp;lock_to_path=0&amp;autoplay=0&amp;autohide_ctrls=0&amp;features=undefined&amp;disabled_features=undefined&amp;html5=1\" width=\"550\" height=\"400\" frameBorder=\"0\" webkitAllowFullScreen mozAllowFullscreen allowfullscreen></iframe>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 27
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "5. Charts and Graphs"
     ]
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "For more information on these Google Charts go to the [Calico Project Wiki](calicoproject.org/ICalico)"
     ]
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "5.1 Histogram"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "GoogleChart(\"Histogram\", [\"Item 1\", \"Item 2\", \"Item 3\"], [(1, 10, 25), (2, 50, 25), (3, 5, 25)])"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<div id=\"chart_div_13\" style=\"height: 400px;\"></div>\n",
        "\n",
        "<script type=\"text/javascript\">\n",
        "        require(['https://www.google.com/jsapi'], function () {\n",
        "          function drawChart() {                \n",
        "            var chart = new google.visualization.Histogram(document.getElementById('chart_div_13'));\n",
        "\n",
        "            var data = google.visualization.arrayToDataTable([['Item 1', 'Item 2', 'Item 3'], [1, 10, 25], [2, 50, 25], [3, 5, 25]]);\n",
        "            var options = {};\n",
        "            chart.draw(data, options);\n",
        "        };\n",
        "        google.load('visualization', '1.0', {'callback': drawChart, 'packages':['corechart']});\n",
        "        });\n",
        "</script>"
       ],
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 31,
       "text": [
        "<calico.widgets.googlechart.GoogleChart at 0x7f1e08090250>"
       ]
      }
     ],
     "prompt_number": 31
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "5.2 Area Chart"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "GoogleChart(\"AreaChart\", [], [6, 7, 8, 9, 3, 2, 6])"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<div id=\"chart_div_5\" style=\"height: 400px;\"></div>\n",
        "\n",
        "<script type=\"text/javascript\">\n",
        "        require(['https://www.google.com/jsapi'], function () {\n",
        "          function drawChart() {                \n",
        "            var chart = new google.visualization.AreaChart(document.getElementById('chart_div_5'));\n",
        "\n",
        "            var data = google.visualization.arrayToDataTable([['', ''], [0, 6], [1, 7], [2, 8], [3, 9], [4, 3], [5, 2], [6, 6]]);\n",
        "            var options = {};\n",
        "            chart.draw(data, options);\n",
        "        };\n",
        "        google.load('visualization', '1.0', {'callback': drawChart, 'packages':['corechart']});\n",
        "        });\n",
        "</script>"
       ],
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 32,
       "text": [
        "<calico.widgets.googlechart.GoogleChart at 0x7f3022df9b10>"
       ]
      }
     ],
     "prompt_number": 32
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "5.3 Scatter Plot"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "GoogleChart(\"ScatterChart\", [], [6, 7, 8, 9, 3, 2, 6])"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<div id=\"chart_div_6\" style=\"height: 400px;\"></div>\n",
        "\n",
        "<script type=\"text/javascript\">\n",
        "        require(['https://www.google.com/jsapi'], function () {\n",
        "          function drawChart() {                \n",
        "            var chart = new google.visualization.ScatterChart(document.getElementById('chart_div_6'));\n",
        "\n",
        "            var data = google.visualization.arrayToDataTable([['', ''], [0, 6], [1, 7], [2, 8], [3, 9], [4, 3], [5, 2], [6, 6]]);\n",
        "            var options = {};\n",
        "            chart.draw(data, options);\n",
        "        };\n",
        "        google.load('visualization', '1.0', {'callback': drawChart, 'packages':['corechart']});\n",
        "        });\n",
        "</script>"
       ],
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 34,
       "text": [
        "<calico.widgets.googlechart.GoogleChart at 0x7f30121d9610>"
       ]
      }
     ],
     "prompt_number": 34
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "5.4 Pie Chart"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "GoogleChart(\"PieChart\", [], [(\"Pie I have eaten\", .33), (\"Pie I have not yet eaten\", .67)])\n",
      "\n"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<div id=\"chart_div_8\" style=\"height: 400px;\"></div>\n",
        "\n",
        "<script type=\"text/javascript\">\n",
        "        require(['https://www.google.com/jsapi'], function () {\n",
        "          function drawChart() {                \n",
        "            var chart = new google.visualization.PieChart(document.getElementById('chart_div_8'));\n",
        "\n",
        "            var data = google.visualization.arrayToDataTable([['', ''], ['Pie I have eaten', 0.33], ['Pie I have not yet eaten', 0.67]]);\n",
        "            var options = {};\n",
        "            chart.draw(data, options);\n",
        "        };\n",
        "        google.load('visualization', '1.0', {'callback': drawChart, 'packages':['corechart']});\n",
        "        });\n",
        "</script>"
       ],
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 36,
       "text": [
        "<calico.widgets.googlechart.GoogleChart at 0x7f30121d9890>"
       ]
      }
     ],
     "prompt_number": 36
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "5.5 Line Chart"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "GoogleChart(\"LineChart\", [], [6, 7, 8, 9, 3, 2, 6])"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<div id=\"chart_div_16\" style=\"height: 400px;\"></div>\n",
        "\n",
        "<script type=\"text/javascript\">\n",
        "        require(['https://www.google.com/jsapi'], function () {\n",
        "          function drawChart() {                \n",
        "            var chart = new google.visualization.LineChart(document.getElementById('chart_div_16'));\n",
        "\n",
        "            var data = google.visualization.arrayToDataTable([['', ''], [0, 6], [1, 7], [2, 8], [3, 9], [4, 3], [5, 2], [6, 6]]);\n",
        "            var options = {};\n",
        "            chart.draw(data, options);\n",
        "        };\n",
        "        google.load('visualization', '1.0', {'callback': drawChart, 'packages':['corechart']});\n",
        "        });\n",
        "</script>"
       ],
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 34,
       "text": [
        "<calico.widgets.googlechart.GoogleChart at 0x7f1e08090590>"
       ]
      }
     ],
     "prompt_number": 34
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "5.6 Column Chart"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "GoogleChart(\"ColumnChart\", [], [6, 7, 8, 9, 3, 2, 6])"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<div id=\"chart_div_18\" style=\"height: 400px;\"></div>\n",
        "\n",
        "<script type=\"text/javascript\">\n",
        "        require(['https://www.google.com/jsapi'], function () {\n",
        "          function drawChart() {                \n",
        "            var chart = new google.visualization.ColumnChart(document.getElementById('chart_div_18'));\n",
        "\n",
        "            var data = google.visualization.arrayToDataTable([['', ''], [0, 6], [1, 7], [2, 8], [3, 9], [4, 3], [5, 2], [6, 6]]);\n",
        "            var options = {};\n",
        "            chart.draw(data, options);\n",
        "        };\n",
        "        google.load('visualization', '1.0', {'callback': drawChart, 'packages':['corechart']});\n",
        "        });\n",
        "</script>"
       ],
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 36,
       "text": [
        "<calico.widgets.googlechart.GoogleChart at 0x7f1e080900d0>"
       ]
      }
     ],
     "prompt_number": 36
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "5.7 Bar Chart"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "GoogleChart(\"BarChart\", [], [6, 7, 8, 9, 3, 2, 6])"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<div id=\"chart_div_11\" style=\"height: 400px;\"></div>\n",
        "\n",
        "<script type=\"text/javascript\">\n",
        "        require(['https://www.google.com/jsapi'], function () {\n",
        "          function drawChart() {                \n",
        "            var chart = new google.visualization.BarChart(document.getElementById('chart_div_11'));\n",
        "\n",
        "            var data = google.visualization.arrayToDataTable([['', ''], [0, 6], [1, 7], [2, 8], [3, 9], [4, 3], [5, 2], [6, 6]]);\n",
        "            var options = {};\n",
        "            chart.draw(data, options);\n",
        "        };\n",
        "        google.load('visualization', '1.0', {'callback': drawChart, 'packages':['corechart']});\n",
        "        });\n",
        "</script>"
       ],
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 39,
       "text": [
        "<calico.widgets.googlechart.GoogleChart at 0x7f30121d9690>"
       ]
      }
     ],
     "prompt_number": 39
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "5.8 Motion Chart"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "<iframe width=\"100%\" height=\"450\" frameborder=\"0\" src=\"https://docs.google.com/spreadsheet/pub?key=0AvXD_9iuphaUdG9pT2lsTzNaU1JObkZFQUFENDI5OGc&single=true&gid=1&output=html&widget=true\"></iframe>"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "<iframe width=\"100%\" height=\"450\" frameborder=\"0\" src=\"https://docs.google.com/spreadsheet/pub?key=0AvXD_9iuphaUdG9pT2lsTzNaU1JObkZFQUFENDI5OGc&single=true&gid=1&output=html&widget=true\"></iframe>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 16
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "6. Data"
     ]
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "6.1 Google Spreadsheets"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "\n",
      "<iframe src=\"https://docs.google.com/spreadsheets/d/1tOtLb1e7kR6FRSV9r7tGTGnJdSNw2kb2oMN32gdhw9E/pubhtml?widget=true&amp;headers=false\"></iframe>"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<iframe src=\"https://docs.google.com/spreadsheets/d/1tOtLb1e7kR6FRSV9r7tGTGnJdSNw2kb2oMN32gdhw9E/pubhtml?widget=true&amp;headers=false\"></iframe>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 17
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "7. Videos"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "\n",
      "<iframe width=\"420\" height=\"315\" src=\"http://www.youtube.com/embed/N9oxmRT2YWw\" frameborder=\"0\" allowfullscreen></iframe>"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<iframe width=\"420\" height=\"315\" src=\"http://www.youtube.com/embed/N9oxmRT2YWw\" frameborder=\"0\" allowfullscreen></iframe>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 18
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "8. Other Embeddable Visuals"
     ]
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "8.1 National Weather Service"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "\n",
      "<iframe src=\"http://www.weather.gov/\" width=\"100%\" height=\"600\"></iframe>"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        "<iframe src=\"http://www.weather.gov/\" width=\"100%\" height=\"600\"></iframe>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 19
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "8.2 Wikipedia Articles"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "<iframe src=\"http://en.wikipedia.org/wiki/Markdown\" width=\"100%\" height=\"400px\" frameborder=\"0\">\n",
      "</iframe>"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "<iframe src=\"http://en.wikipedia.org/wiki/Markdown\" width=\"100%\" height=\"400px\" frameborder=\"0\">\n",
        "</iframe>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 20
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "9. Document Collaboration"
     ]
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "9.1 Commenting By Disqus"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "%%html\n",
      "\n",
      " <div id=\"disqus_thread\"></div>\n",
      "    <script type=\"text/javascript\">\n",
      "        /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */\n",
      "        var disqus_shortname = 'calicoproject'; // required: replace example with your forum shortname\n",
      "\n",
      "        /* * * DON'T EDIT BELOW THIS LINE * * */\n",
      "        (function() {\n",
      "            var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;\n",
      "            dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';\n",
      "            (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);\n",
      "        })();\n",
      "    </script>\n",
      "    <noscript>Please enable JavaScript to view the <a href=\"http://disqus.com/?ref_noscript\">comments powered by Disqus.</a></noscript>\n",
      "    <a href=\"http://disqus.com\" class=\"dsq-brlink\">comments powered by <span class=\"logo-disqus\">Disqus</span></a>"
     ],
     "language": "python",
     "metadata": {
      "format": "row"
     },
     "outputs": [
      {
       "html": [
        "\n",
        " <div id=\"disqus_thread\"></div>\n",
        "    <script type=\"text/javascript\">\n",
        "        /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */\n",
        "        var disqus_shortname = 'calicoproject'; // required: replace example with your forum shortname\n",
        "\n",
        "        /* * * DON'T EDIT BELOW THIS LINE * * */\n",
        "        (function() {\n",
        "            var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;\n",
        "            dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';\n",
        "            (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);\n",
        "        })();\n",
        "    </script>\n",
        "    <noscript>Please enable JavaScript to view the <a href=\"http://disqus.com/?ref_noscript\">comments powered by Disqus.</a></noscript>\n",
        "    <a href=\"http://disqus.com\" class=\"dsq-brlink\">comments powered by <span class=\"logo-disqus\">Disqus</span></a>"
       ],
       "metadata": {},
       "output_type": "display_data",
       "text": [
        "<IPython.core.display.HTML object>"
       ]
      }
     ],
     "prompt_number": 21
    },
    {
     "cell_type": "heading",
     "level": 1,
     "metadata": {},
     "source": [
      "10. Bibliographic Support"
     ]
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "10.1 Internal BibTex Database"
     ]
    },
    {
     "cell_type": "raw",
     "metadata": {},
     "source": [
      "<!--bibtex\n",
      "\n",
      "@book{wellfarecut,\n",
      "      title = {Our Greatest Threat: The Rise of Anti-Wellfare Politics in Calico in the 21st Century},\n",
      "      author = {Jacob, Bernadette},\n",
      "      year = {2010},\n",
      "      publisher = {Jupyter University Press},\n",
      "      address = {Jupyter, JY}\n",
      "\n",
      "}\n",
      "@book{calicoww2:1,\n",
      "    title = {Calico and WWII: Untold History},\n",
      "    author = {French, Viola},\n",
      "    year = {1997},\n",
      "    publisher = {Calicia City Free Press},\n",
      "    address = {Calicia City, CA}\n",
      "}\n",
      "\n",
      "@book{calicoww2:2,\n",
      "    title = {Rebuilding Calico After Japanese Occupation},\n",
      "    author = {Kepps, Milo},\n",
      "    year = {2002},\n",
      "    publisher = {Python Books},\n",
      "    address = {Pythonia, PY}\n",
      "}\n",
      "\n",
      "@Book{block2006rape,\n",
      " author = {Block, Sharon},\n",
      " title = {Rape and sexual power in early America},\n",
      " publisher = {University of North Carolina Press},\n",
      " year = {2006},\n",
      " address = {Chapel Hill},\n",
      " isbn = {9780807857618}\n",
      " }\n",
      "-->"
     ]
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "10.2 Example Text With In-Line Citations"
     ]
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Rebuilding Calico after Japanese occupation took many years <a name=\"ref-1\"/>[(Kepps, 2002)](#cite-calicoww2:2).\n",
      "Anti-Welfare politics have risen in popularity in Calico over the last three decades  <a name=\"ref-2\"/>[(Jacob, 2010)](#cite-wellfarecut).\n",
      "Calico was a Japanese puppet state during WWII <a name=\"ref-3\"/>[(French, 1997)](#cite-calicoww2:1).\n"
     ]
    },
    {
     "cell_type": "heading",
     "level": 2,
     "metadata": {},
     "source": [
      "10.3 Example References List"
     ]
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "\n",
      "<a name=\"cite-calicoww2:2\"/><sup>[^](#ref-1) </sup>Kepps, Milo. 2002. _Rebuilding Calico After Japanese Occupation_.\n",
      "\n",
      "<a name=\"cite-wellfarecut\"/><sup>[^](#ref-2) </sup>Jacob, Bernadette. 2010. _Our Greatest Threat: The Rise of Anti-Wellfare Politics in Calico in the 21st Century_.\n",
      "\n",
      "<a name=\"cite-calicoww2:1\"/><sup>[^](#ref-3) </sup>French, Viola. 1997. _Calico and WWII: Untold History_.\n",
      "\n"
     ]
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "from calico.utils import ottobib\n",
      "ottobib(\"9780807857618\")"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [
      {
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 2,
       "text": [
        "'@Book{block2006rape,\\n author = {Block, Sharon},\\n title = {Rape and sexual power in early America},\\n publisher = {University of North Carolina Press},\\n year = {2006},\\n address = {Chapel Hill},\\n isbn = {9780807857618}\\n }'"
       ]
      }
     ],
     "prompt_number": 2
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "ottobib(\"0-471-37568-3\")"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [
      {
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 3,
       "text": [
        "'@Book{ifrah2000the,\\n author = {Ifrah, Georges},\\n title = {The universal history of numbers : from prehistory to the invention of the computer},\\n publisher = {Wiley},\\n year = {2000},\\n address = {New York},\\n isbn = {0471375683}\\n }'"
       ]
      }
     ],
     "prompt_number": 3
    },
    {
     "cell_type": "markdown",
     "metadata": {},
     "source": [
      "Citation <a name=\"ref-4\"/>[(Block, 2006)](#cite-block2006rape)."
     ]
    },
    {
     "cell_type": "code",
     "collapsed": true,
     "input": [],
     "language": "python",
     "metadata": {},
     "outputs": []
    }
   ],
   "metadata": {}
  }
 ]
}